<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <!-- 公共头部 -->
    <header class="headertop">
        <div class="time">12:00</div>
        <div class="iconfont1">
            <i class="iconfont icon-shoujixinhao"></i>
            <i class="iconfont icon-wuxianwang"></i>
            <i class="iconfont icon-dianchi"></i>
        </div>
    </header>
    <!-- 轮播图 -->
    <header class="carousel">
        <!-- 装大图片的盒子 -->
        <div class="trest_borard">
            <p class="trest trest1"></p>
            <p class="trest trest11 trest2"></p>
        </div>
        <!-- 装小圆点的盒子 -->
        <div class="dot">
            <b class="dot11 dot22"></b>
            <b class="dot11"></b>
        </div>
    </header>
    <!-- 内容部分 -->
    <main class="contentmana">
        <!-- 排名和打卡 -->
        <main class="rank_clockin">
            <div class="rank"></div>
            <div class="clockin"></div>
        </main>
        <!-- 运动数据和徽章 -->
        <main class="movementdata_emblem">
            <!-- 运动数据 -->
            <div class="movementdata"></div>
            <!-- 徽章 -->
            <div class="emblem"></div>
        </main>
        <!-- 课程训练 -->
        <main class="trainingcourse"></main>
        <!-- 户外跑步 -->
        <main class="outdoor_running"></main>
    </main>
    <!-- 手机导航栏 -->
    <footer class="footers">
        <!-- 首页按钮 -->
        <main class="homepage"> <i class="iconfont icon-main" style="font-size: 38px;"></i></main>
        <!-- 运动按钮 -->
        <main class="motion"><i class="iconfont icon-white-sports" style="font-size: 38px;"></i></main>
        <!-- 我的按钮 -->
        <main class="myworld"><i class="iconfont icon-wode" style="font-size: 38px;"></i></main>
    </footer>
</body>
</html>